<template>
  <div>
    <van-sticky style="background-color: white">
      <van-nav-bar
        title="新增地址"
        left-text="返回"
        left-arrow
        @click-left="onClickLeft"
      />
    </van-sticky>
    <van-address-edit
      :area-list="areaList"
      :address-info="{
        name: info.name,
        tel: info.tel,
        addressDetail: info.addressDetail,
        areaCode: info.areaCode,
        postalCode: info.postalCode,
        isDefault: info.isDefault,
      }"
      show-postal
      show-delete
      show-set-default
      show-search-result
      :area-columns-placeholder="['请选择', '请选择', '请选择']"
      @save="onSave"
      @delete="onDelete"
    />
  </div>
</template>
<script>
import { ref } from 'vue';
import { Toast } from 'vant';
import { areaList } from "@vant/area-data";
export default {
  data() {
    return {
      areaList,
      searchResult: [],
      info: [],
      userId:sessionStorage.getItem("userId"),
    };
  },
  methods: {
    onClickLeft() {
      this.$router.back()
    },
    onSave(content) {
      this.isDefault = content.isDefault ? "1" : "0"; //数据库该项设置为0，1，如不需修改可删除该行
      //如果地址id不存在，则连接新增地址接口，存在则连接修改地址接口
      //返回地址列表页，强制刷新
      this.axios
        .post(
          "/address/add",
          `userId=${this.userId}&consignee=${content.name}&phone=${content.tel}&provinceName=${content.province}&cityName=${content.city}&destriceName=${content.county}&detail=${content.addressDetail}&isDefault=${this.isDefault }&areaCode=${content.areaCode}`
        )
        .then((res) => {
          console.log(res);
      });
      this.$toast.success("保存成功");
      location.reload();
    },
    onDelete() {
      let id = this.$route.query.id;
      //发送请求连接删除地址接口
      this.axios.post("/address/remove?id=" + id).then((res) => {
        console.log(res.data);
      });
      this.$toast.success("删除成功");
      this.$router.go(-1);
    },
  },
};
</script>

<style scoped>

</style>
